<template>
  <div>
    <NavBar>
      <template #left>
        <img
          @click="handleBackIconClick"
          src="/images/icon/back.svg"
          alt=""
        />
        <span>设置</span>
      </template>
    </NavBar>
    <CellGroup class="top">
      <Cell>
        账号与安全
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
    </CellGroup>
    <CellGroup>
      <Cell>
        新消息提醒
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
      <Cell>
        勿扰模式
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
      <Cell>
        聊天
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
      <Cell>
        隐私
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
      <Cell>
        设备
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
      <Cell>
        通用
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
    </CellGroup>
    <CellGroup>
      <Cell>
        关于微信
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
      <Cell>
        帮助与反馈
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
    </CellGroup>

    <CellGroup>
      <Cell>
        插件
        <template #right>
          <img src="/images/icon/link.svg" alt="" />
        </template>
      </Cell>
    </CellGroup>
    <CellGroup>
      <Cell @click="handleLogOut"> 退出登录</Cell>
    </CellGroup>
  </div>
</template>

<script>
import NavBar from "src/components/NavBar.vue"
import Cell from "src/components/Cell.vue"
import CellGroup from "src/components/CellGroup.vue"
export default {
  components: {
    NavBar,
    Cell,
    CellGroup,
  },
  methods: {
    handleBackIconClick() {
      this.$router.push("/app/mine")
    },
    handleLogOut() {
      this.$global.state.userInfo._id = ""
      this.$router.push({ path: "/user/login" })
    },
  },
}
</script>

<style lang="scss" scoped>
.top {
  margin-top: 80px;
}
</style>
